<template>
  <div v-if="data">
    <div class="flex_between_bottom" style="padding-right: 20px;">
      <modal-header :left="`售后管理`" :right="title" @back="close" />
    </div>
    <div class="content-padding">
      <div class="signUp">
        <a-row class="see_row" style="width:100%;">
          <a-form-model ref="ruleForm" class="ant-advanced-form" :model="data" :rules="rules"
            :labelCol="{ style: 'width:108px' }">
            <div class="colTitle">学生基本信息</div>
            <a-col class="borderCol">
              <a-form-model-item label="姓名" prop="name" class="form-w-95">
                <a-input class="baseCol" v-model="data.name" :maxLength="15" placeholder="请输入姓名" />
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="性别" prop="sex" class="form-w-95">
                <a-select placeholder="请选择性别" class="baseCol" v-model="data.sex">
                  <a-select-option v-for="(item, index) in sexList" :key="index" :value="item.id">{{item.typeNameValue}}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="证件类型" prop="cardType" class="form-w-95">
                <a-select v-model="data.cardType" placeholder="请选择证件类型" class="baseCol">
                  <a-select-option v-for="(item, index) in cardList" :key="index" :value="item.id">{{item.typeNameValue}}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="证件号码" prop="cardId" class="form-w-95" >
                <a-input class="baseCol" v-model.trim="data.cardId" placeholder="请输入证件号码" />
              </a-form-model-item>
            </a-col>
            <div class="colTitle">报考基本信息</div>
            <a-col class="borderCol">
              <a-form-model-item label="报名批次" prop="registerBatch" class="form-w-95">
                <a-select class="baseCol" placeholder="请选择报名批次" allowClear v-model="data.registerBatch">
                  <a-select-option v-for="(item, i) in piciList" :key="i" :value="+item.id">{{ item.typeNameValue }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="报名院校" prop="registerSchool" class="form-w-95">
                <a-select class="baseCol" placeholder="请选择报名院校" allowClear v-model="data.registerSchool">
                  <a-select-option v-for="(item, i) in xiaoList" :key="i" :value="item.id">{{ item.typeNameValue }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="所报层次" prop="registerLevel" class="form-w-95">
                <a-select class="baseCol" placeholder="请选择所报层次" allowClear v-model="data.registerLevel">
                  <a-select-option v-for="(item, index) in cengciList" :key="index" :value="item.id">{{item.typeNameValue }}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="所报专业" prop="registerMajor" class="form-w-95" :colon="false">
                <a-input class="baseCol" :maxLength="15" v-model.trim="data.registerMajor" placeholder="请输入所报专业" />
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="学习形式" prop="studyType" class="form-w-95">
                <a-select class="baseCol" placeholder="请选择学习形式" allowClear v-model="data.studyType">
                  <a-select-option v-for="(item, index) in xingshiList" :key="index" :value="item.id">{{item.typeNameValue}}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="学生状态" prop="studentStatus" class="form-w-95">
                <a-select class="baseCol" placeholder="请选择学生状态" allowClear v-model="data.studentStatus">
                  <a-select-option v-for="(item, index) in statusList" :key="index" :value="item.id">{{item.typeNameValue}}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <div class="colTitle">上传材料</div>
            <a-col class="borderColHeight">
              <a-form-model-item label="上传正反面身份证" prop="attachmentId" :labelCol="{ style: 'width:140px' }">
                <a-upload :accept="imageAccept" :action="uploadUrl" list-type="picture-card"
                  :file-list="identityImgList" @preview="uploadImgPreview" :headers="uploadHead"
                  @change="uploadImgChangeId" :before-upload="beforeUpload" :data="additionalData" :remove="idDel">
                  <div v-if="(identityImgList.length < 1)">
                    <a-icon type="plus" />
                    <div class="ant-upload-text">上传身份证正面图片</div>
                  </div>
                </a-upload>
                <a-upload :accept="imageAccept" :action="uploadUrl" list-type="picture-card"
                  :file-list="identityImgList2" @preview="uploadImgPreview" :headers="uploadHead"
                  @change="uploadImgChangeId2" :before-upload="beforeUpload" :data="additionalData" :remove="idDel2">
                  <div v-if="(identityImgList2.length < 1)">
                    <a-icon type="plus" />
                    <div class="ant-upload-text">上传身份证反面图片</div>
                  </div>
                </a-upload>
              </a-form-model-item>
            </a-col>
            <a-col class="borderColHeight">
              <a-form-model-item label="上传电子照片" prop="attachmentId" :labelCol="{ style: 'width:140px' }">
                <a-upload :accept="imageAccept" :action="uploadUrl" list-type="picture-card"
                :file-list="selfImgList" @preview="uploadImgPreview" :headers="uploadHead"
                @change="uploadImgChangeSelf" :before-upload="beforeUpload" :data="additionalData" :remove="selfDel">
                <div v-if="(selfImgList.length < 1)">
                  <a-icon type="plus" />
                  <div class="ant-upload-text">上传电子照片</div>
                </div>
              </a-upload>
              </a-form-model-item>
            </a-col>
            <a-col class="borderColHeight">
              <a-form-model-item label="上传毕业证" prop="attachmentId" :labelCol="{ style: 'width:140px' }">
                <a-upload :accept="imageAccept" :action="uploadUrl" list-type="picture-card"
                :file-list="graduationImgList" @preview="uploadImgPreview" :headers="uploadHead"
                @change="uploadImgChangeGraduation" :before-upload="beforeUpload" :data="additionalData" :remove="graduationDel">
                <div v-if="(graduationImgList.length < 1)">
                  <a-icon type="plus" />
                  <div class="ant-upload-text">上传毕业证照片</div>
                </div>
              </a-upload>
              </a-form-model-item>
            </a-col>
            <a-col class="borderColHeight fileColHeight">
              <a-form-model-item label="上传学信网电子注册备案表" prop="attachmentId" :labelCol="labelCol">
                <div class="uploadFile">
                  <a-upload name="file" :accept="docAccept" :action="uploadUrl" :data="additionalData" @change="recordFormfileChange" :file-list="recordFormList" :remove="recordFormDel">
                    <a-button> <a-icon type="upload"/> 上传文件 </a-button>
                  </a-upload>
                  <!-- <template>
                    <a-upload-dragger name="file" :accept="docAccept" :action="uploadUrl" :before-upload="beforeRecordFormUpload" :remove="recordFormDel" :multiple="false" @change="handleChange" :customRequest="recordForm">
                      <p class="ant-upload-drag-icon">
                        <a-icon style="color:#C0C4CC;" type="cloud-upload" />
                      </p>
                      <p class="ant-upload-text" style="font-size:13px">
                        将文件拖到此处，或<span style="color:#5284FE;">点击上传</span>
                      </p>
                    </a-upload-dragger>
                  </template> -->
                  <div v-if="recordFormList.length > 0" class="float"></div>
                </div>
              </a-form-model-item>
            </a-col>
            <a-col class="borderColHeight fileColHeight">
              <a-form-model-item label="上传异地生证明材料" prop="attachmentId" :labelCol="labelCol">
                <div class="uploadFile">
                  <a-upload name="file" :accept="docAccept" :action="uploadUrl" :data="additionalData" @change="nolocalProve" :file-list="nolocalProveList" :remove="recordFormDel">
                    <a-button> <a-icon type="upload"/> 上传文件 </a-button>
                  </a-upload>
                  <!-- <a-upload-dragger name="file" :accept="docAccept" :action="uploadUrl" :before-upload="beforeRecordFormUpload" :remove="nolocalProveDel" :multiple="false" @change="handleChange" :customRequest="nolocalProve">
                    <p class="ant-upload-drag-icon">
                      <a-icon style="color:#C0C4CC;" type="cloud-upload" />
                    </p>
                    <p class="ant-upload-text" style="font-size:13px">
                      将文件拖到此处，或<span style="color:#5284FE;">点击上传</span>
                    </p>
                  </a-upload-dragger> -->
                  <div v-if="nolocalProveList.length > 0" class="float"></div>
                </div>
              </a-form-model-item>
            </a-col>
            <a-col class="borderColHeight fileColHeight">
              <a-form-model-item label="上传其他证明材料" prop="attachmentId" :labelCol="labelCol">
                <div class="uploadFile">
                  <a-upload name="file" :accept="docAccept" :action="uploadUrl" :data="additionalData" @change="othersProve" :file-list="othersProveList" :remove="othersProveDel">
                    <a-button> <a-icon type="upload"/> 上传文件 </a-button>
                  </a-upload>
                  <!-- <a-upload-dragger name="file" :accept="docAccept" :action="uploadUrl" :before-upload="beforeRecordFormUpload" :remove="othersProveDel" :multiple="false" @change="handleChange" :customRequest="othersProve">
                    <p class="ant-upload-drag-icon">
                      <a-icon style="color:#C0C4CC;" type="cloud-upload" />
                    </p>
                    <p class="ant-upload-text" style="font-size:13px">
                      将文件拖到此处，或<span style="color:#5284FE;">点击上传</span>
                    </p>
                  </a-upload-dragger> -->
                  <div v-if="othersProveList.length > 0" class="float"></div>
                </div>
              </a-form-model-item>
            </a-col>
            <div class="colTitle">联系方式</div>
            <a-col class="borderCol">
              <a-form-model-item label="手机" prop="phone" class="form-w-95" :colon="false">
                <a-input class="baseCol" v-model.trim="data.phone" placeholder="请输入手机号" />
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="Email" prop="email" class="form-w-95" :colon="false">
                <a-input class="baseCol" v-model.trim="data.email" placeholder="请输入Email号" />
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="联系地址" prop="address" class="form-w-95" :colon="false">
                <a-input class="baseCol" v-model.trim="data.address" placeholder="请输入联系地址" />
              </a-form-model-item>
            </a-col>
            <a-col class="borderCol">
              <a-form-model-item label="联系电话" prop="connectPhone" class="form-w-95" :colon="false">
                <a-input class="baseCol" v-model.trim="data.connectPhone" placeholder="请输入联系电话" />
              </a-form-model-item>
            </a-col>
            <a-col :span="24" class="borderCol" style="border-bottom:none">
              <div style="width:100%;text-align:center;">
                <a-button type="primary" @click="handleOk">确定</a-button>
                <a-button style="margin-left:20px;" @click="close">返回</a-button>
              </div>
            </a-col>
          </a-form-model>
        </a-row>
      </div>
    </div>
    <imgPreview v-model="preview.visible" :imgList="[preview.image]" />
  </div>
</template>

<script>
import { imageAccept, docAccept } from '@/utils/options.js'
import { getAuthorizationHead } from '@/utils/request.js'
import { getBase64 } from '@/utils/util.js'
import imgPreview from '@/components/img-preview'
import modalHeader from '@/components/modal-header'
import { editStudent, typeList, uploadImg } from '@/services/adminApi'
const BASE_URL = process.env.VUE_APP_API_URL
export default {
  name: 'deviceBackRepairEdit',
  components: {
    modalHeader,
    imgPreview
  },
  data () {
    return {
      labelCol: {
        style: 'width:140px;white-space:normal'
      },
      title: '学生信息修改',
      flag: false,
      id: null,
      type: 1,
      BASE_URL,
      imageAccept,
      docAccept,
      uploadUrl: uploadImg(),
      uploadBaseUrl: `${BASE_URL}/files/`,
      uploadHead: getAuthorizationHead(),
      preview: {
        visible: false,
        image: ''
      },
      brandOptions: [],
      deviceOptions: [],
      data: {

      },
      sexList: [],
      cardList: [],
      piciList: [],
      xiaoList: [],
      cengciList: [],
      xingshiList: [],
      statusList: [],
      rules: {
        name: [{ required: true, message: '请输入学生姓名', trigger: 'blur' }],
        sex: [{ required: true, message: '请选择性别', trigger: 'change' }],
        // cardType: [{ required: true, message: '请选择设证件类型', trigger: 'change' }],
        // cardId: [{ required: true, message: '请输入证件号码', trigger: 'blur' }],
        // registerBatch: [{ required: true, message: '请选择报名批次', trigger: 'change' }],
        // registerSchool: [{ required: true, message: '请选择报名院校', trigger: 'change' }],
        // registerLevel: [{ required: true, message: '请选择所报层次', trigger: 'change' }],
        // registerMajor: [{ required: true, message: '请输入所报专业', trigger: 'blur' }],
        // studyType: [{ required: true, message: '请选择习形式', trigger: 'change' }],
        // studentStatus: [{ required: true, message: '请选择学生状态', trigger: 'change' }],
        phone: [{ required: true, message: '请输入手机号', trigger: 'blur' }]
      },
      fileList: [],
      identityImgList: [],
      identityImgUrlList: [],
      identityImgList2: [],
      identityImgUrlList2: [],
      idImgUrlList: [],
      selfImgList: [],
      graduationImgList: [],
      recordFormList: [],
      nolocalProveList: [],
      othersProveList: [],
      loading: '',
      imageUrl: '',
      additionalData: {
        name: ''
      }
    }
  },
  created () {
    this.uploadImageUrl = `${BASE_URL}/member/admin/base/member/level/upload`
    this.uploadHead = getAuthorizationHead()
  },
  methods: {
    // 初始化
    onInitial (record) {
      this.additionalData.name = record.name
      console.log(record)
      this.uploadUrl = uploadImg()
      this.data = record
      // 身份证照片
      if (record.identityImgUrls) {
        var arr = record.identityImgUrls.toString().split(',')
        this.identityImgList = [
          {
            uid: '-1',
            name: 'image.png',
            status: 'done',
            type: 'image/png',
            id: '',
            url: this.uploadBaseUrl + arr[0]
          }
        ]
        this.identityImgList2 = [
          {
            uid: '-1',
            name: 'image.png',
            status: 'done',
            type: 'image/png',
            id: '',
            url: this.uploadBaseUrl + arr[1]
          }
        ]
        this.identityImgUrlList = [
          {
            uid: '-1',
            name: 'image.png',
            status: 'done',
            type: 'image/png',
            id: '',
            url: arr[0]
          }
        ]
        this.identityImgUrlList2 = [
          {
            uid: '-1',
            name: 'image.png',
            status: 'done',
            type: 'image/png',
            id: '',
            url: arr[1]
          }
        ]
        this.identityImgUrlList = arr[0]
        this.identityImgUrlList2 = arr[1]
        this.data.identityImgUrls = record.identityImgUrls
      } else {
        this.identityImgList = []
        this.identityImgList2 = []
        this.data.identityImgUrls = ''
      }
      // 电子照片
      if (record.selfImgUrls) {
        this.selfImgList = [
          {
            uid: '-1',
            name: 'image.png',
            status: 'done',
            type: 'image/png',
            id: '',
            url: this.uploadBaseUrl + record.selfImgUrls
          }
        ]
        this.data.selfImgUrls = record.selfImgUrls
      } else {
        this.selfImgList = []
        this.data.selfImgUrls = ''
      }
      // 毕业证
      if (record.graduationImgUrls) {
        this.graduationImgList = [
          {
            uid: '-1',
            name: 'image.png',
            status: 'done',
            type: 'image/png',
            id: '',
            url: this.uploadBaseUrl + record.graduationImgUrls
          }
        ]
        this.data.graduationImgUrls = record.graduationImgUrls
      } else {
        this.graduationImgList = []
        this.data.graduationImgUrls = ''
      }
      // 学信网电子注册备案表
      if (record.recordFormUrls) {
        this.recordFormList = [
          {
            uid: '-1',
            name: record.recordFormUrls.split('/')[1],
            status: 'done',
            type: '',
            id: '',
            url: this.uploadBaseUrl + record.recordFormUrls
          }
        ]
        this.data.recordFormUrls = record.recordFormUrls
      } else {
        this.recordFormList = []
        this.data.recordFormUrls = ''
      }
      // 异地生证明材料
      if (record.nolocalProveUrls) {
        this.nolocalProveList = [
          {
            uid: '-1',
            name: record.nolocalProveUrls.split('/')[1],
            status: 'done',
            type: '',
            id: '',
            url: this.uploadBaseUrl + record.nolocalProveUrls
          }
        ]
        this.data.nolocalProveUrls = record.nolocalProveUrls
      } else {
        this.nolocalProveList = []
        this.data.nolocalProveUrls = ''
      }
      // 其它证明材料
      if (record.othersProveUrls) {
        this.othersProveList = [
          {
            uid: '-1',
            name: record.othersProveUrls.split('/')[1],
            status: 'done',
            type: '',
            id: '',
            url: this.uploadBaseUrl + record.othersProveUrls
          }
        ]
        this.data.othersProveUrls = record.othersProveUrls
      } else {
        this.othersProveList = []
        this.data.othersProveUrls = ''
      }
      this.getInit()
      setTimeout(() => {
        this.cardList.forEach(item => {
          if (+item.id === +this.data.cardType) {
            this.data.cardType = item.typeNameValue
          }
        })
        this.piciList.forEach(item => {
          if (+item.id === +this.data.registerBatch) {
            this.data.registerBatch = item.typeNameValue
          }
        })
        this.xiaoList.forEach(item => {
          if (+item.id === +this.data.registerSchool) {
            this.data.registerSchool = item.typeNameValue
          }
        })
        this.cengciList.forEach(item => {
          if (+item.id === +this.data.registerLevel) {
            this.data.registerLevel = item.typeNameValue
          }
        })
        this.xingshiList.forEach(item => {
          if (+item.id === +this.data.studyType) {
            this.data.studyType = item.typeNameValue
          }
        })
        this.statusList.forEach(item => {
          if (+item.id === +this.data.studentStatus) {
            this.data.studentStatus = item.typeNameValue
          }
        })
      }, 800)
    },
    // 初始化获取下拉菜单列表
    getInit () {
      this.getSex()
      this.getCard()
      this.getPici()
      this.getXuexiao()
      this.getCengci()
      this.getXingshi()
      this.getStatus()
    },
    async getSex () {
      const res = await typeList({ type: 1 })
      const { success, data: response, msg } = res
      if (success) {
        this.sexList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    async getCard () {
      const res = await typeList({ type: 2 })
      const { success, data: response, msg } = res
      if (success) {
        this.cardList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    async getPici () {
      const res = await typeList({ type: 3 })
      const { success, data: response, msg } = res
      if (success) {
        this.piciList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    async getXuexiao () {
      const res = await typeList({ type: 4 })
      const { success, data: response, msg } = res
      if (success) {
        this.xiaoList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    async getCengci () {
      const res = await typeList({ type: 5 })
      const { success, data: response, msg } = res
      if (success) {
        this.cengciList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    async getXingshi () {
      const res = await typeList({ type: 6 })
      const { success, data: response, msg } = res
      if (success) {
        this.xingshiList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    async getStatus () {
      const res = await typeList({ type: 7 })
      const { success, data: response, msg } = res
      if (success) {
        this.statusList = response.records
      } else {
        this.$message.newFun(msg, 'error', 2)
      }
    },
    // 上传后预览图片
    async uploadImgPreview (file) {
      if (!file.url && !file.preview) {
        file.preview = await getBase64(file.originFileObj)
      }
      this.preview.image = file.url || file.preview
      this.preview.visible = true
    },
    // 上传前添加参数
    beforeUpload (file) {
      console.log(file)
      if (this.data.name === '' || this.data.name === undefined) {
        this.$message.newFun('请输入姓名后再点击上传', 'error', 3)
        return
      }
      this.additionalData.name = this.data.name
    },
    // 上传身份证图片
    uploadImgChangeId ({ fileList }) {
      this.identityImgList = fileList.filter(f =>
        imageAccept.split(',').includes(f.type)
      )
      for (let i = 0; i < this.identityImgList.length; i++) {
        const d = this.identityImgList[i]
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.identityImgList.splice(i, 1)
            } else {
              this.identityImgList.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: i,
                url: this.uploadBaseUrl + d.response.data
              })
              this.identityImgUrlList = [d.response.data]
            }
          } else {
            this.identityImgList.splice(i, 1)
            this.identityImgUrlList.splice(i, 1)
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    idDel () {
      this.identityImgList = []
      this.identityImgUrlList = []
    },
    // 上传身份证图片
    uploadImgChangeId2 ({ fileList }) {
      this.identityImgList2 = fileList.filter(f =>
        imageAccept.split(',').includes(f.type)
      )
      for (let i = 0; i < this.identityImgList2.length; i++) {
        const d = this.identityImgList2[i]
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.identityImgList2.splice(i, 1)
            } else {
              this.identityImgList2.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: i,
                url: this.uploadBaseUrl + d.response.data
              })
              this.identityImgUrlList2 = [d.response.data]
            }
          } else {
            this.identityImgList2.splice(i, 1)
            this.identityImgUrlList2.splice(i, 1)
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    idDel2 () {
      this.identityImgList2 = []
      this.identityImgUrlList2 = []
    },
    // 上传电子照片
    uploadImgChangeSelf ({ fileList }) {
      this.selfImgList = fileList.filter(f =>
        imageAccept.split(',').includes(f.type)
      )
      for (let i = 0; i < this.selfImgList.length; i++) {
        const d = this.selfImgList[i]
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.selfImgList.splice(i, 1)
            } else {
              this.selfImgList.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: '',
                url: this.uploadBaseUrl + d.response.data
              })
              this.data.selfImgUrls = d.response.data
            }
          } else {
            this.selfImgList.splice(i, 1)
            this.data.selfImgUrls = ''
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    selfDel () {
      this.selfImgList = []
      this.data.selfImgUrls = ''
    },
    // 上传毕业证
    uploadImgChangeGraduation ({ fileList }) {
      this.graduationImgList = fileList.filter(f =>
        imageAccept.split(',').includes(f.type)
      )
      for (let i = 0; i < this.graduationImgList.length; i++) {
        const d = this.graduationImgList[i]
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.graduationImgList.splice(i, 1)
            } else {
              this.graduationImgList.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: '',
                url: this.uploadBaseUrl + d.response.data
              })
              this.data.graduationImgUrls = d.response.data
            }
          } else {
            this.graduationImgList.splice(i, 1)
            this.data.graduationImgUrls = ''
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    graduationDel () {
      this.graduationImgList = []
      this.data.graduationImgUrls = ''
    },
    // 上传文件
    beforeRecordFormUpload (file) {
    },
    handleChange (info) {
      const { status } = info.file
      if (status !== 'uploading') {
        console.log(info.file, info.fileList)
      }
      if (status === 'done') {
        console.log('上传成功')
      } else if (status === 'error') {
        console.log('上传失败')
      }
    },
    // 上传学信网电子注册备案表
    recordForm (options) {
      if (this.data.name === '' || this.data.name === undefined) {
        this.$message.newFun('请输入姓名后再点击上传', 'error', 3)
        return
      }
      var axios = require('axios')
      const formData = new FormData()
      formData.append('file', options.file) // 这里添加文件
      formData.append('name', this.data.name) // 这里添加额外参数
      // 使用 axios 发送请求
      axios.post(options.action, formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
        // onUploadProgress: progressEvent => {
        //   if (options.onProgress) {
        //     options.onProgress({
        //       percent: (progressEvent.loaded / progressEvent.total) * 100
        //     })
        //     this.$message.newFun('上传成功', 'success', 3)
        //   }
        // }
      }).then(response => {
        // 成功处理逻辑
        this.$message.newFun('上传成功', 'success', 3)
        options.onSuccess(response.data, this.data.name)
        this.recordFormList.push(response.data)
        this.data.recordFormUrls = response.data
      }).catch(error => {
        // 错误处理逻辑
        options.onError(error)
      })
    },
    // 上传学信网电子注册备案表
    recordFormfileChange ({ fileList }) {
      console.log(fileList)
      // this.recordFormList = fileList.filter(f =>
      //   docAccept.split(',').includes(f.type)
      // )
      this.recordFormList = fileList
      console.log(this.recordFormList)
      for (let i = 0; i < this.recordFormList.length; i++) {
        const d = this.recordFormList[i]
        console.log(d)
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.recordFormList.splice(i, 1)
            } else {
              this.recordFormList.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: '',
                url: this.uploadBaseUrl + d.response.data
              })
              this.data.recordFormUrls = d.response.data
            }
          } else {
            this.recordFormList.splice(i, 1)
            this.data.recordFormUrls = ''
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    // 删除
    recordFormDel () {
      this.recordFormList = []
      this.data.recordFormUrls = ''
    },
    // 上传异地生证明材料
    nolocalProve ({ fileList }) {
      this.nolocalProveList = fileList
      for (let i = 0; i < this.nolocalProveList.length; i++) {
        const d = this.nolocalProveList[i]
        console.log(d)
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.nolocalProveList.splice(i, 1)
            } else {
              this.nolocalProveList.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: '',
                url: this.uploadBaseUrl + d.response.data
              })
              this.data.nolocalProveUrls = d.response.data
            }
          } else {
            this.nolocalProveList.splice(i, 1)
            this.data.nolocalProveUrls = ''
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    // 异地生删除
    nolocalProveDel () {
      this.nolocalProveList = []
      this.data.nolocalProveUrls = ''
    },
    // 上传其他证明材料
    othersProve ({ fileList }) {
      this.othersProveList = fileList
      for (let i = 0; i < this.othersProveList.length; i++) {
        const d = this.othersProveList[i]
        console.log(d)
        if (d.status === 'done' && Object.hasOwnProperty.call(d, 'response')) {
          if (d.response.success) {
            if (d.size > 1024 * 1024 * 20) {
              this.$message.newFun('上传文件大小不能超过20MB', 'error', 3)
              this.othersProveList.splice(i, 1)
            } else {
              this.othersProveList.splice(i, 1, {
                name: d.name,
                status: d.status,
                type: d.type,
                uid: d.uid,
                id: '',
                url: this.uploadBaseUrl + d.response.data
              })
              this.data.othersProveUrls = d.response.data
            }
          } else {
            this.othersProveList.splice(i, 1)
            this.data.othersProveUrls = ''
            this.$message.newFun(d.response.message, 'error', 3)
          }
        }
      }
    },
    // 其他删除
    othersProveDel () {
      this.othersProveList = []
      this.data.othersProveUrls = ''
    },
    handleOk () {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          if(this.identityImgUrlList && this.identityImgUrlList2){
            this.data.identityImgUrls = this.identityImgUrlList.toString() + ',' + this.identityImgUrlList2.toString()
          }else if(this.identityImgUrlList){
            this.data.identityImgUrls = this.identityImgUrlList.toString()
          }else if(this.identityImgUrlList2){
            this.data.identityImgUrls = this.identityImgUrlList2.toString()
          }else{
            this.data.identityImgUrls = ""
          }
          // this.idImgUrlList = this.identityImgUrlList.concat(this.identityImgUrlList2)
          // if (this.idImgUrlList.length < 2) {
          //   this.$message.newFun('请上传正反面身份证照片', 'error', 3)
          //   return
          // } else {
          //   this.data.identityImgUrls = this.identityImgUrlList.toString() + ',' + this.identityImgUrlList2.toString()
          // }

          this.cardList.forEach(item => {
            if (+item.id === +this.data.cardType) {
              this.data.cardType = item.typeNameValue
            }
          })
          this.piciList.forEach(item => {
            if (+item.id === +this.data.registerBatch) {
              this.data.registerBatch = item.typeNameValue
            }
          })
          this.xiaoList.forEach(item => {
            if (+item.id === +this.data.registerSchool) {
              this.data.registerSchool = item.typeNameValue
            }
          })
          this.cengciList.forEach(item => {
            if (+item.id === +this.data.registerLevel) {
              this.data.registerLevel = item.typeNameValue
            }
          })
          this.xingshiList.forEach(item => {
            if (+item.id === +this.data.studyType) {
              this.data.studyType = item.typeNameValue
            }
          })
          this.statusList.forEach(item => {
            if (+item.id === +this.data.studentStatus) {
              this.data.studentStatus = item.typeNameValue
            }
          })
          this.editDeviceStore()
        }
      })
    },
    async editDeviceStore () {
      delete this.data.createDate
      delete this.data.updateDate
      const res = await editStudent(this.data)
      if (res.success) {
        this.$message.newFun('编辑成功', 'success', 3)
        this.close()
      } else {
        this.$message.newFun(res.msg, 'error', 3)
      }
    },
    close () {
      this.$emit('close')
    }
  }
}
</script>
<style lang="less" scoped>
.baseCol {
  width: 100%;
  min-width: 200px;
}
.imgsDiv{
  position: relative;
  padding-left:15px;
  width:90px;
  &::before{
    content: '*';
    position: absolute;
    top: 5px;
    left: 5%;
    color:#f5222d;
  }
}
.signUp{
  width: 1190px;
  /*margin: 20px auto 0;*/
  min-height: 360px;
  border: 1px solid #d1d4d7;
  .colTitle{
    padding: 0 20px;
    box-sizing: border-box;
    height:50px;
    line-height:50px;
    background: #2a868e;
    color: #fff;
    border: 1px solid #2a868e;
  }
  .borderCol{
    height: 64px;
    padding-top: 14px;
    padding-right: 14px;
    margin-bottom: 0!important;
    border-bottom: 1px solid #d1d4d7;
  }
  .borderColHeight {
    min-height: 144px;
    padding-top: 14px;
    margin-bottom: 0!important;
    border-bottom: 1px solid #d1d4d7;
    /deep/ .ant-form-item-children{
      display:flex;
      .ant-upload-picture-card-wrapper{
        width:210px
      }
    }
  }
  .fileColHeight{
    /deep/ .ant-upload{
      height: auto!important;
    }
  }
}
.uploadFile{
  margin-left: 30px;
  margin-top: 15px;
  position: relative;
  .float {
    width: 110px;
    height: 33px;
    background: rgba(255, 255, 255, 0.65);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
  }
}

</style>
